<template>

	<div class="liebiao">
		<div class="danpin center" v-for="time in DetailsOfClassification">
			<div class="biaoti" :classBId="time.classBId"  v-model="time.classBId">{{time.classBName}}</div>
			<div class="main center">
        <div class="mingxing fl mb20" v-for="i in classBlistfotdetails" style="border:2px solid #fff;width:230px;cursor:pointer;" onmouseout="this.style.border='2px solid #fff'" onmousemove="this.style.border='2px solid red'">
          <div class="sub_mingxing"><a href=""><img src="../../assets/image/liebiao_hongmin4x.jpg" alt=""></a></div>
          <div class="pinpai"><a href="">{{i.classCName}}</a></div>
          <div class="youhui">{{i.classCTitle}}</div>
          <div class="jiage">{{i.classCprice}}</div>
        </div>
				<div class="clear">
          <!--换行商品-->
        </div>
			</div>
		</div>

	</div> 
</template>
<script>
	export default {
		name: 'liebiao',
		data() {
			return {
        DetailsOfClassification:[],
        classBlistfotdetails:[],
        arrayAugmentations:[]
			}
		}
		,mounted()
    {

      //加载二级分类
      this.axios.post('/api/HomePageInterface/DetailsOfClassification', this.qs.stringify({
        classAId:window.sessionStorage.getItem("classAId")
      }), {
        headers: {
          'Content-Type': 'application/x-www-form-urlencoded'
        }
      })
        .then(function(res) {
          if (res.data.status == "200"){
            for(let i=0;i<res.data.msg.length;i++)
            {
              res.data.msg[i].commentPic="/api/img/"+ res.data.msg[i].commentPic;
              res.data.msg[i].userImg="/api/img/"+ res.data.msg[i].userImg;
            }

            this.arrayAugmentations=res.data.msg;

            this.DetailsOfClassification = res.data.msg;
            console.log(" ......我们长度............."+this.DetailsOfClassification.length);




            //动态查询分类
            this.axios.post('/api/HomePageInterface/classBlistfotdetails', this.qs.stringify({

            }), {
              headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
              }
            })
              .then(function(res) {
                if (res.data.status == "200") {
                  alert(res.data.status.length)
                  for(let i=0;i<res.data.msg.length;i++)
                  {
                    res.data.msg[i].classCPIc="/api/img/"+ res.data.msg[i].classCPIc;
                    res.data.msg[i].classCTitle=res.data.msg[i].classCTitle.substr(0,12);
                  }
                  this.classBlistfotdetails = res.data.msg;
                }
                //控制台打印请求成功时返回的数据
                //bind(this)可以不用
              }.bind(this))
              .catch(function(err) {
                if (err.response) {
                  console.log(err.response)
                  //控制台打印错误返回的内容
                }
              }.bind(this));























          }else if(res.data.status == "300"){
            // alert("没有数据");
          }else if(res.data.status == "400")
          {
            alert("程序错误");
          }
        }.bind(this))
        .catch(function(err) {
          if (err.response) {
            console.log(err.response)
            //控制台打印错误返回的内容
          }
        }.bind(this));


    },
    methods:{

    }

  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
	.liebiao {
		background: white;
		width: 90%;
		margin: 0px auto;
		text-align: left;
	}
  #box {
    width: 100px;
    height: 100px;
    line-height: 100px;
    font-size: 20px;
    text-align: center;
    border: 1px solid black;
    margin: 50px;
    color: yellow;
  }


</style>
